import 'dart:io';

import 'package:flutter/material.dart';
import 'package:hygf/http/file_transfer/down_cap.dart';
import 'package:hygf/res/HDColors.dart';

import '../../../http/DioClient.dart';
import 'image_picker_widget.dart';

class ImagePreviewPage extends StatefulWidget {
  List<ImagePickerData> data;
  ImagePreviewPage({Key? key, required this.data}) : super(key: key);

  @override
  _ImagePreviewPageState createState() => _ImagePreviewPageState();
}

class _ImagePreviewPageState extends State<ImagePreviewPage> {
  final ScrollController _listController = ScrollController();
  final PageController _pageController = PageController();
  int selectedIndex = 0;
  // 标记是列表点击造成的pageview切换
  bool isTap = false;

  int tapTo = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Container(
        color: Colors.black,
        child: Stack(
          children: [
            PageView.builder(
              controller: _pageController,
              itemBuilder: (context, index) {
                return InkWell(
                  onLongPress: () {
                    DioClient().downloadImage(widget.data[index].filePath);
                  },
                  child: _getBigImage(widget.data[index].filePath),
                );
              },
              itemCount: widget.data.length,
              onPageChanged: (index) {
                if (isTap) {
                  if (tapTo == index) {
                    isTap = false;
                  }
                } else {
                  _listController.animateTo(index * 68, duration: Duration(milliseconds: 200), curve: Curves.ease);
                  setState(() {
                    selectedIndex = index;
                  });
                }
              },
            ),
            Positioned(
              left: 0,
              right: 0,
              bottom: 0,
              child: Container(
                width: double.infinity,
                height: 68,
                color: Colors.black87.withOpacity(0.6),
                child: ListView.builder(
                  controller: _listController,
                  itemBuilder: (context, index) {
                    return Padding(
                      padding: EdgeInsets.all(4),
                      child: GestureDetector(
                        onTap: () {
                          isTap = true;
                          tapTo = index;
                          _pageController.animateToPage(index, duration: Duration(milliseconds: 200), curve: Curves.ease);
                          setState(() {
                            selectedIndex = index;
                          });
                        },
                        child: Container(
                          decoration: BoxDecoration(
                              border: Border.all(color: index == selectedIndex ? HDColors.accent : Colors.transparent, width: 2)),
                          child: _getSmallImage(widget.data[index].filePath),
                        ),
                      ),
                    );
                  },
                  itemCount: widget.data.length,
                  scrollDirection: Axis.horizontal,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }

  _getBigImage(String path) {
    if (path.startsWith("http")) {
      // 表示网络地址
      return Image.network(path,);
    } else {
      return Image.file(File(path),);
    }
  }

  _getSmallImage(String path) {
    if (path.startsWith("http")) {
      // 表示网络地址
      return Image.network(path, width: 60, height: 60, fit: BoxFit.cover,);
    } else {
      return Image.file(File(path), width: 60, height: 60, fit: BoxFit.cover,);
    }
  }
}
